import React, { useState } from "react";

const logoSrc = "data:image/webp;base64,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";

const legalPages = {
  aviso: {
    title: "Aviso Legal",
    content: `AVISO LEGAL

Titularidad del sitio web

En cumplimiento del deber de información establecido en la Ley 34/2002, de 11 de julio, de Servicios de la Sociedad de la Información y del Comercio Electrónico (LSSI-CE), se informa que la presente página web es titularidad de:

Titular: José Carlos López Ortega
Nombre profesional: López-Ortega Abogados
Domicilio profesional: Avda. Alfonso el Sabio nº 35, 2º C, 03001 Alicante
Teléfono: +34 637 75 12 49
Correo electrónico: info@lopezortegaabogados.com

Objeto

La presente página web tiene por objeto facilitar al público en general información sobre los servicios jurídicos ofrecidos por López-Ortega Abogados, así como permitir el contacto con el despacho y la solicitud de información o cita profesional.

Propiedad intelectual e industrial

Todos los contenidos del sitio web (textos, imágenes, diseño gráfico, logotipos, iconos, software, nombres comerciales y demás elementos incluidos en la web) son propiedad de López-Ortega Abogados o, en su caso, de terceros autorizados, y se encuentran protegidos por la normativa nacional e internacional sobre propiedad intelectual e industrial.

Queda prohibida su reproducción, distribución, comunicación pública o transformación total o parcial sin autorización expresa del titular.

Responsabilidad

López-Ortega Abogados no se hace responsable del uso indebido que pudiera realizarse de los contenidos de esta página web, ni garantiza la inexistencia de errores o interrupciones en el acceso al sitio web, aunque adoptará las medidas necesarias para evitarlos y subsanarlos.

Asimismo, el despacho no será responsable de los daños o perjuicios que pudieran derivarse del uso de la web o de las decisiones adoptadas sobre la base de la información contenida en la misma.

Protección de datos personales

El tratamiento de los datos personales se rige por lo dispuesto en el Reglamento (UE) 2016/679 (RGPD), la Ley Orgánica 3/2018 de Protección de Datos Personales y garantía de los derechos digitales y demás normativa aplicable, conforme a lo establecido en la Política de Privacidad de esta página web.

Legislación aplicable y jurisdicción

La relación entre el usuario y el titular del sitio web se regirá por la legislación española vigente.

En caso de controversia, las partes se someterán a los Juzgados y Tribunales que resulten competentes conforme a la normativa aplicable.`
  },
  privacidad: {
    title: "Política de Privacidad",
    content: `POLÍTICA DE PRIVACIDAD

López-Ortega Abogados garantiza la privacidad de los usuarios, el secreto y la seguridad de los datos personales, de conformidad con lo establecido en el Reglamento (UE) 2016/679 del Parlamento Europeo y del Consejo (RGPD), la Ley Orgánica 3/2018 de Protección de Datos Personales y garantía de los derechos digitales y demás normativa aplicable, adoptando para ello las medidas técnicas y organizativas necesarias para evitar la pérdida, mal uso, alteración, acceso no autorizado y robo de los datos personales facilitados.

DATOS DEL RESPONSABLE DEL TRATAMIENTO

Titular: José Carlos López Ortega
Despacho profesional: López-Ortega Abogados
Domicilio profesional: Avda. Alfonso el Sabio nº 35, 2º C, 03001 Alicante
Correo electrónico: info@lopezortegaabogados.com
Teléfono: 637 75 12 49
Colegiado en el Ilustre Colegio de Abogados de Alicante.

FINALIDADES DEL TRATAMIENTO

Los datos personales facilitados a través de la página web, correo electrónico o cualquier otro medio serán incorporados a un fichero responsabilidad de López-Ortega Abogados.

La información facilitada por los usuarios será tratada con las siguientes finalidades:

• Gestionar consultas, solicitudes de información o peticiones relacionadas con los servicios profesionales ofrecidos por el despacho.

• Prestar asesoramiento jurídico y mantener la relación profesional y contractual con clientes y colaboradores.

• Remitir comunicaciones profesionales, información jurídica o novedades relacionadas con la actividad del despacho cuando exista consentimiento del usuario.

• Gestionar procesos de selección y candidaturas remitidas mediante currículum vitae.

Los currículums recibidos serán tratados con absoluta confidencialidad y conservados durante un plazo máximo de un año, procediéndose posteriormente a su supresión.

LEGITIMACIÓN

La base jurídica que legitima el tratamiento de los datos personales es el consentimiento otorgado por el usuario, la ejecución de la relación profesional y el cumplimiento de obligaciones legales aplicables al despacho profesional.

PROCEDENCIA DE LOS DATOS

Los datos personales se obtienen directamente de los usuarios, clientes o colaboradores mediante formularios, comunicaciones electrónicas, consultas profesionales o cualquier otra relación mantenida con López-Ortega Abogados.

Las categorías de datos tratadas podrán incluir:

• Datos identificativos.
• Datos de contacto.
• Información profesional y económica.
• Información necesaria para la prestación de servicios jurídicos.

No se tratarán categorías especiales de datos salvo cuando resulte estrictamente necesario para la adecuada defensa jurídica de los intereses del cliente.

CONSERVACIÓN DE LOS DATOS

Los datos personales serán conservados mientras exista una relación profesional o contractual y durante los plazos legalmente exigidos para el cumplimiento de obligaciones legales, fiscales y deontológicas.

Una vez finalizados dichos plazos, los datos serán eliminados aplicando las medidas de seguridad adecuadas.

DESTINATARIOS

No se cederán datos personales a terceros salvo obligación legal o cuando resulte necesario para la correcta prestación de los servicios jurídicos contratados.

No se realizan transferencias internacionales de datos.

DERECHOS DE LOS USUARIOS

Los usuarios podrán ejercer en cualquier momento sus derechos de acceso, rectificación, supresión, oposición, limitación del tratamiento y portabilidad mediante solicitud dirigida a:

info@lopezortegaabogados.com

Asimismo, podrán presentar reclamación ante la Agencia Española de Protección de Datos cuando consideren que el tratamiento de sus datos no se ajusta a la normativa vigente.

MEDIDAS DE SEGURIDAD

López-Ortega Abogados adopta las medidas técnicas y organizativas necesarias para garantizar la confidencialidad, integridad y seguridad de los datos personales tratados.

ACTUALIZACIONES

López-Ortega Abogados se reserva el derecho de modificar la presente Política de Privacidad para adaptarla a novedades legislativas o jurisprudenciales. La versión vigente será siempre la publicada en esta página web.

PROPIEDAD INTELECTUAL E INDUSTRIAL

Todos los contenidos, textos, imágenes, diseño, logotipos y elementos que integran esta página web son titularidad de López-Ortega Abogados o disponen de autorización para su uso, quedando prohibida su reproducción, distribución o utilización sin autorización expresa.

Cualquier uso no autorizado de los contenidos podrá constituir una vulneración de la normativa sobre propiedad intelectual e industrial.`
  },
  cookies: {
    title: "Política de Cookies",
    content: `La presente página web podrá utilizar cookies técnicas necesarias para garantizar el correcto funcionamiento y experiencia de navegación del usuario.

Las cookies son pequeños archivos que se almacenan en el dispositivo del usuario y permiten reconocer determinadas preferencias de navegación.

El usuario puede configurar su navegador para bloquear o eliminar las cookies instaladas, si bien ello podría afectar al correcto funcionamiento de determinados apartados de la web.

Esta web no utiliza cookies con fines publicitarios ni cede información a terceros sin consentimiento previo del usuario.`
  }
};

const pages = {
  nosotros: {
    title: "Sobre Nosotros",
    content: `López-Ortega Abogados es un despacho con más de veinte años de trayectoria profesional, consolidado sobre los principios de rigor jurídico, confianza y atención personalizada al cliente.

La firma inició su actividad centrando su práctica de manera exclusiva en el Derecho Laboral, área en la que continúa siendo una referencia gracias a su amplia experiencia en defensa de trabajadores, empresas y directivos ante despidos, reclamaciones salariales, incapacidades, conflictos colectivos y procedimientos ante la jurisdicción social.

Como consecuencia del crecimiento del despacho y de la creciente demanda de asesoramiento integral por parte de nuestros clientes, la firma amplió progresivamente sus áreas de actuación incorporando abogados especializados en distintas ramas del Derecho, entre ellas Derecho Civil, Mercantil y Penal.

Cada profesional del despacho desarrolla su actividad exclusivamente dentro de su ámbito de especialización, permitiendo ofrecer un asesoramiento técnico preciso, actualizado y adaptado a las particularidades de cada asunto.

López-Ortega Abogados combina experiencia, especialización y trato directo, manteniendo una práctica jurídica seria, discreta y orientada a la máxima defensa de los intereses de sus clientes.`
  },
  laboral: {
    title: "Derecho Laboral",
    content: `José Carlos López Ortega, fundador de la firma, desarrolla su actividad profesional de manera exclusiva en el ámbito del Derecho Laboral y de la Seguridad Social, contando con una amplia trayectoria y experiencia en la dirección y defensa de procedimientos laborales de especial complejidad.

A lo largo de más de dos décadas de ejercicio profesional, ha consolidado una práctica especializada basada en el rigor técnico, la estrategia procesal y la atención personalizada, prestando asesoramiento y defensa jurídica tanto a trabajadores como a empresas en todo el territorio nacional.

Su trayectoria y especialización le han permitido alcanzar un reconocido prestigio dentro del sector jurídico laboralista, contando con una sólida cartera de clientes consolidados y procedimientos de relevancia en el ámbito nacional.

José Carlos López Ortega es letrado del Ilustre Colegio de Abogados de Alicante, desarrollando su actividad profesional bajo los más altos estándares de rigor técnico, ética profesional y compromiso con el cliente.

La firma interviene habitualmente en procedimientos de despido, reclamaciones salariales, incapacidades, modificaciones sustanciales de condiciones de trabajo, conflictos colectivos, alta dirección y actuaciones ante la jurisdicción social, con especial atención a las reclamaciones derivadas de accidente de trabajo, recargo de prestaciones, responsabilidad empresarial y determinación de contingencias profesionales.

La experiencia acumulada, junto con una dedicación exclusiva al Derecho Laboral, permite ofrecer a cada cliente un asesoramiento altamente especializado, cercano y orientado a la máxima defensa de sus intereses.`
  },
  contacto: {
    title: "Contacto",
    content: `Tel. 637 75 12 49

Página web en construcción.`
  }
};

const materias = [
  {
    title: "Derecho Civil",
    text: `El despacho presta asesoramiento integral en materia de Derecho Civil, ofreciendo una atención personalizada tanto a particulares como a empresas en procedimientos judiciales y extrajudiciales.

Nuestra actuación comprende reclamaciones de cantidad, responsabilidad contractual y extracontractual, arrendamientos, derecho de propiedad, obligaciones y contratos, sucesiones, procedimientos matrimoniales y de familia, divorcios, así como asuntos de derecho bancario, reclamaciones frente a entidades financieras y procedimientos acogidos a la Ley de Segunda Oportunidad.

La intervención en cada asunto se desarrolla desde una perspectiva rigurosa y estratégica, priorizando siempre la seguridad jurídica y la protección de los intereses del cliente.`
  },
  {
    title: "Derecho Mercantil",
    text: `En el ámbito mercantil, el despacho asesora a sociedades, empresarios y profesionales en el desarrollo ordinario de su actividad, proporcionando soluciones jurídicas adaptadas a las necesidades de cada empresa.

La firma interviene en contratación mercantil, constitución y restructuración societaria, conflictos entre socios, reclamaciones comerciales, responsabilidad de administradores y procedimientos vinculados a la actividad empresarial.

Nuestro objetivo es ofrecer un asesoramiento preventivo y eficaz que permita minimizar riesgos legales y garantizar la adecuada protección de la actividad económica de nuestros clientes.`
  },
  {
    title: "Derecho Penal",
    text: `El área de Derecho Penal del despacho ofrece defensa y asistencia letrada en procedimientos penales, actuando con absoluta discreción, rigor técnico y máxima implicación en cada asunto.

Prestamos asesoramiento tanto en fase de investigación como durante el procedimiento judicial, interviniendo en delitos económicos, patrimoniales, societarios y otras infracciones de especial relevancia jurídica, así como en procedimientos derivados de accidentes de tráfico y reclamaciones vinculadas a la responsabilidad penal y civil correspondiente.

La experiencia procesal y el estudio individualizado de cada caso permiten desarrollar estrategias de defensa sólidas y orientadas a la mejor protección de los derechos e intereses del cliente.`
  }
];

const oficinas = [
  {
    title: "Oficina Alicante",
    address: "Avda. Alfonso el Sabio, 35, 2º C",
    city: "Alicante · C.P. 03001",
    map: ""
  },
  {
    title: "Oficina Pilar de la Horadada",
    address: "C/ San Juan, 15, 1º B",
    city: "Pilar de la Horadada · C.P. 03190",
    map: ""
  }
];

function HeaderButton({ activePage, setActivePage, page, children }) {
  const isActive = activePage === page;

  return (
    <button
      type="button"
      onClick={() => setActivePage(page)}
      className={`rounded-full px-2 py-2 transition duration-200 hover:text-amber-700 sm:px-3 ${isActive ? "text-amber-700" : "text-zinc-600"}`}
    >
      {children}
    </button>
  );
}

function WatermarkLogo() {
  return (
    <img
      src={logoSrc}
      alt=""
      aria-hidden="true"
      className="pointer-events-none absolute inset-0 m-auto h-auto w-full max-w-3xl object-contain opacity-[0.07] sm:max-w-4xl sm:opacity-10"
    />
  );
}

function HomePage() {
  return (
    <section className="flex min-h-[70vh] w-full flex-col items-center justify-center text-center sm:min-h-[78vh] md:min-h-[80vh]">
      <style>{`
        @keyframes fadeLogo {
          from {
            opacity: 0;
            transform: translateY(12px);
          }
          to {
            opacity: 1;
            transform: translateY(0);
          }
        }
      `}</style>

      <img
        src={logoSrc}
        alt="López-Ortega Abogados"
        className="h-auto w-full max-w-[92vw] object-contain sm:max-w-3xl md:max-w-5xl"
        style={{ animation: "fadeLogo 2.2s ease-out forwards" }}
      />
    </section>
  );
}

function TextPage({ title, content, backgroundImage = false }) {
  return (
    <section
      className="relative mx-auto flex min-h-[72vh] max-w-6xl items-start justify-start overflow-hidden px-2 py-12 sm:px-6 sm:py-16 md:min-h-[80vh] md:px-16 md:py-24"
      style={backgroundImage ? {
        backgroundImage: 'linear-gradient(rgba(255,255,255,0.88), rgba(255,255,255,0.88)), url("/mnt/data/ChatGPT Image 6 may 2026, 23_36_24.png")',
        backgroundSize: 'cover',
        backgroundPosition: 'center'
      } : {}}
    >
      <WatermarkLogo />

      <div className="relative z-10 w-full max-w-4xl">
        <h1 className="border-l-2 border-amber-700 pl-4 text-3xl font-light uppercase leading-tight tracking-[0.1em] text-zinc-900 sm:pl-6 sm:text-4xl sm:tracking-[0.12em] md:text-5xl md:tracking-[0.14em]">
          {title}
        </h1>

        <p className="mt-8 whitespace-pre-line pl-4 text-left text-base leading-8 text-zinc-600 sm:mt-10 sm:pl-6 sm:text-lg sm:leading-9 md:mt-12 md:leading-10">
          {content}
        </p>
      </div>
    </section>
  );
}

function MateriasPage() {
  return (
    <section className="relative mx-auto flex min-h-[72vh] max-w-6xl items-start justify-start overflow-hidden px-2 py-12 sm:px-6 sm:py-16 md:min-h-[80vh] md:px-16 md:py-24">
      <WatermarkLogo />

      <div className="relative z-10 w-full max-w-5xl">
        <h1 className="border-l-2 border-amber-700 pl-4 text-3xl font-light uppercase leading-tight tracking-[0.1em] text-zinc-900 sm:pl-6 sm:text-4xl sm:tracking-[0.12em] md:text-5xl md:tracking-[0.14em]">
          Otras Materias del Derecho
        </h1>

        <div className="mt-8 grid gap-6 pl-4 sm:mt-12 sm:gap-8 sm:pl-6 md:mt-14">
          {materias.map((item) => (
            <article key={item.title} className="rounded-2xl border border-zinc-200 bg-white/90 p-5 backdrop-blur-sm sm:rounded-3xl sm:p-8 md:p-10">
              <h2 className="text-2xl font-medium text-zinc-900 sm:text-3xl">{item.title}</h2>
              <p className="mt-5 whitespace-pre-line text-left text-base leading-8 text-zinc-600 sm:mt-6 sm:text-lg sm:leading-9">{item.text}</p>
            </article>
          ))}
        </div>
      </div>
    </section>
  );
}

function OficinasPage() {
  return (
    <section className="relative mx-auto flex min-h-[72vh] max-w-6xl items-start justify-start overflow-hidden px-2 py-12 sm:px-6 sm:py-16 md:min-h-[80vh] md:px-16 md:py-24">
      <WatermarkLogo />

      <div className="relative z-10 w-full max-w-6xl">
        <h1 className="border-l-2 border-amber-700 pl-4 text-3xl font-light uppercase leading-tight tracking-[0.1em] text-zinc-900 sm:pl-6 sm:text-4xl sm:tracking-[0.12em] md:text-5xl md:tracking-[0.14em]">
          Oficinas
        </h1>

        <p className="mt-6 max-w-4xl pl-4 text-left text-base leading-8 text-zinc-600 sm:mt-8 sm:pl-6 sm:text-xl sm:leading-10">
          Disponemos de dos sedes profesionales para ofrecer una atención cercana, directa y adaptada a las necesidades de nuestros clientes, tanto de forma presencial como mediante consulta telemática previa cita.
        </p>

        <div className="mt-8 grid gap-6 pl-4 sm:mt-12 sm:gap-8 sm:pl-6 md:mt-14 md:grid-cols-2 md:gap-10">
          {oficinas.map((office) => (
            <article key={office.title} className="rounded-2xl border border-zinc-200 bg-white/90 p-6 shadow-sm backdrop-blur-sm sm:rounded-3xl sm:p-8 md:p-10">
              <h2 className="text-2xl font-medium text-zinc-900 sm:text-3xl">{office.title}</h2>
              <p className="mt-5 text-left text-base leading-8 text-zinc-600 sm:mt-6 sm:text-xl sm:leading-10">
                {office.address}<br />
                {office.city}
              </p>

              
            </article>
          ))}
        </div>
      </div>
    </section>
  );
}

/*
=====================================================
GUÍA RÁPIDA PARA PUBLICAR LA WEB EN INTERNET
=====================================================

1. Crear cuenta gratuita en:
https://vercel.com

2. Crear repositorio en:
https://github.com

3. Subir este proyecto React al repositorio.

4. En Vercel:
- New Project
- Import Git Repository
- Seleccionar el repositorio
- Deploy

5. Comprar dominio:
Ejemplo:
- lopezortegaabogados.com

Proveedores recomendados:
- https://www.ionos.es
- https://www.ovhcloud.com/es-es/domains/
- https://es.godaddy.com

6. Conectar dominio:
En Vercel → Settings → Domains

7. HTTPS y seguridad:
Vercel instala automáticamente:
- certificado SSL
- versión móvil
- optimización de velocidad
- protección HTTPS

=====================================================
*/

export default function LopezOrtegaEnConstruccion() {
  const [activePage, setActivePage] = useState("inicio");

  let content = <HomePage />;

  if (activePage === "nosotros") {
    content = <TextPage title={pages.nosotros.title} content={pages.nosotros.content} backgroundImage />;
  }

  if (activePage === "laboral") {
    content = <TextPage title={pages.laboral.title} content={pages.laboral.content} />;
  }

  if (activePage === "materias") {
    content = <MateriasPage />;
  }

  if (activePage === "oficinas") {
    content = <OficinasPage />;
  }

  if (activePage === "contacto") {
    content = <TextPage title={pages.contacto.title} content={pages.contacto.content} />;
  }

  if (activePage === "aviso") {
    content = <TextPage title={legalPages.aviso.title} content={legalPages.aviso.content} />;
  }

  if (activePage === "privacidad") {
    content = <TextPage title={legalPages.privacidad.title} content={legalPages.privacidad.content} />;
  }

  if (activePage === "cookies") {
    content = <TextPage title={legalPages.cookies.title} content={legalPages.cookies.content} />;
  }

  return (
    <main className="min-h-screen bg-white px-4 sm:px-6">
      <header className="mx-auto flex max-w-7xl flex-wrap items-center justify-center gap-2 py-5 text-center text-[0.62rem] font-medium uppercase tracking-[0.12em] sm:gap-3 sm:py-6 sm:text-[0.72rem] sm:tracking-[0.16em] md:justify-end md:gap-6 md:text-sm lg:gap-8 lg:text-base">
        <HeaderButton activePage={activePage} setActivePage={setActivePage} page="inicio">Inicio</HeaderButton>
        <HeaderButton activePage={activePage} setActivePage={setActivePage} page="nosotros">Sobre nosotros</HeaderButton>
        <HeaderButton activePage={activePage} setActivePage={setActivePage} page="laboral">Derecho Laboral</HeaderButton>
        <HeaderButton activePage={activePage} setActivePage={setActivePage} page="materias">Otras Materias</HeaderButton>
        <HeaderButton activePage={activePage} setActivePage={setActivePage} page="oficinas">Oficinas</HeaderButton>
        <HeaderButton activePage={activePage} setActivePage={setActivePage} page="contacto">Contacto</HeaderButton>
      </header>

      {content}
    <footer className="mx-auto mt-8 flex max-w-7xl flex-col items-center justify-between gap-5 border-t border-zinc-200 py-7 text-center text-xs tracking-[0.1em] text-zinc-500 sm:mt-10 sm:flex-row sm:gap-6 sm:py-8 sm:text-sm sm:tracking-[0.12em]">
        <div className="text-zinc-400">
          © {new Date().getFullYear()} López-Ortega Abogados
        </div>

        <div className="flex flex-wrap items-center justify-center gap-4 sm:gap-6">
        <button onClick={() => setActivePage("aviso")} className="hover:text-amber-700 transition">
          Aviso Legal
        </button>

        <button onClick={() => setActivePage("privacidad")} className="hover:text-amber-700 transition">
          Política de Privacidad
        </button>

        <button onClick={() => setActivePage("cookies")} className="hover:text-amber-700 transition">
          Política de Cookies
        </button>
        </div>
      </footer>
    </main>
  );
}